<template>
    <div class="search-group">
        <el-input
            type="text"
            v-model="keyword"
            :placeholder="props.placeholder"
            :suffix-icon="Search"
            @keyup.enter="onSearch"
        >
            <!-- <template #append>
                <el-button :icon="Search" @click="onSearch" />
            </template> -->
        </el-input>
    </div>
</template>
<script setup>
import { Search } from "@element-plus/icons-vue";
const emits = defineEmits(["search"]);
const props = defineProps({
    placeholder: {
        type: String,
        default: "请输入关键词",
    },
});
const keyword = ref("");
const onSearch = () => {
    emits("search", keyword.value);
};
</script>
<style lang="scss" scoped>
.search-group {
    width: 100%;
    padding: 20px 0;

    :deep(.el-input) {
        width: 200px;
    }
}
</style>
